/*
 * @Descripttion : 通用js
 * @Author       : liuzhifang
 * @Date         : 2022-06-02 13:42:45
 * @LastEditors  : Please set LastEditors
 * @LastEditTime : 2022-12-24 00:18:35
 */

// 导航服务和消息
foxui.tooltip({
	el: '#barService',
	content: barServiceHtml(),
	className: 'bar-service-container',
	width: '324px',
});
foxui.tooltip({
	el: '#barBell',
	content: barBellHtml(),
	className: 'bar-bell-container',
	effect: 'light',
	width: '330px',
});

// 导航折叠功能
$('.foxcms-menu-nav-fold').on('click', function() {
	let $this = $(this),
		$icon = $this.find('i'),
		$inner = $('.foxcms-menu-nav-inner'),
		isRotate = $icon.is('.rotate');

	if (isRotate) {
		$icon.removeClass('rotate');
		$inner.animate({ width: '200px' });
	} else {
		$icon.addClass('rotate');
		$inner.animate({ width: 0 });
	}
});

// 根据窗口宽度判断是否折叠
let foldTimer = null;
$(window).on('resize', function() {
	if (foldTimer) {
		clearTimeout(foldTimer);
		foldTimer = null;
	}
	foldTimer = setTimeout(function() {
		let width = $(window).width(),
			$fold = $('.foxcms-menu-nav-fold'),
			$icon = $fold.find('i'),
			$inner = $('.foxcms-menu-nav-inner'),
			isRotate = $icon.is('.rotate');

		if (width < 1440) {
			if (!isRotate) {
				$icon.addClass('rotate');
				$inner.animate({ width: 0 });
			}
		} else {
			if (isRotate) {
				$icon.removeClass('rotate');
				$inner.animate({ width: '200px' });
			}
		}

		clearTimeout(foldTimer);
		foldTimer = null;
	}, 300);
});

// 收起/展开所有导航
$('.foxcms-menu-expand-all i').on('click', function() {
	let $container = $('.foxui-menu.foxui-type-vertical'),
		$this = $(this),
		isActive = $this.is('.is-active');

	if (isActive) {
		let $openHandle = $container.find('.foxui-menu-handle.is-active');
		$openHandle.click();
		$this.removeClass('is-active');
	} else {
		let $foldHandle = $container.find('.foxui-menu-handle:not(.is-active)');
		$foldHandle.click();
		$this.addClass('is-active');
	}
});

// 根据折叠转换全部折叠按钮状态
$(document).on('click', '.foxui-menu.foxui-type-vertical .foxui-menu-handle', function() {
	let count = $('.foxui-menu.foxui-type-vertical .foxui-menu-handle').length,
		openLen = $('.foxui-menu.foxui-type-vertical .foxui-menu-handle.is-active').length;
	if (count === openLen) {
		$('.foxcms-menu-expand-all i').addClass('is-active');
	} else {
		$('.foxcms-menu-expand-all i').removeClass('is-active');
	}
});

// 表单字段调用
$(document).on('click', '.call-field .foxui-tag', function() {
	const text = $(this).text(),
		el = document.createElement('input');

	el.value = text;
	el.setAttribute('readonly', '');
	el.style.position = 'absolute';
	el.style.opacity = 0;
	document.body.appendChild(el);
	el.select();
	document.execCommand('copy');
	document.body.removeChild(el);

	foxui.message({ text: '已复制到剪贴板' });
});

// 右侧浮动预览模板
$('.web-image-view .content-box .main-part').on('mouseover', function() {
	const viewHeight = $(this).height();
	const imgHeight = $(this).find('img').height();
	const mValue = viewHeight - imgHeight;
	$(this)
		.find('img')
		.css('marginTop', mValue + 'px');
});

$('.web-image-view .content-box .main-part').on('mouseout', function() {
	$(this).find('img').css('marginTop', 0);
});

/* bar -> html
 *****************************************************************************************************/
function barServiceHtml() {
	return [
		'<div class="bar-service-content">',
		'<div class="top">',
		'<div class="foxui-row foxui-gutter-0">',
		'<div class="foxui-col-xs-8 foxui-col-sm-8">',
		'<a class="col-inter" href="#">',
		'<i class="foxui-icon-weixiao-f"></i>',
		'<span>建议留言</span>',
		'</a>',
		'</div>',
		'<div class="foxui-col-xs-8 foxui-col-sm-8">',
		'<a class="col-inter" href="#">',
		'<i class="foxui-icon-QQ-f"></i>',
		'<span>QQ客服</span>',
		'</a>',
		'</div>',
		'<div class="foxui-col-xs-8 foxui-col-sm-8">',
		'<a class="col-inter" href="#">',
		'<i class="foxui-icon-hezuo-f"></i>',
		'<span>代理加盟</span>',
		'</a>',
		'</div>',
		'</div>',
		'</div>',
		'<div class="bottom">',
		'<div class="foxui-row foxui-gutter-6 foxui-align-items-center">',
		'<div class="foxui-col-xs-10 foxui-col-sm-10">',
		'<div class="col-inter img-box">',
		'<img src="' + STATIC_PATH + 'images/service_qr_code.jpg"/>',
		'</div>',
		'</div>',
		'<div class="foxui-col-xs-14 foxui-col-sm-14">',
		'<div class="col-inter">',
		'<p>扫码联系官方客服</p>',
		'<p>提供线上咨询</p>',
		'<h3><i class="foxui-icon-dianhua-o"></i><span>400-888-3116</span></h3>',
		'</div>',
		'</div>',
		'</div>',
		'</div>',
		'</div>',
	].join('');
}

function barBellHtml() {
	return [
		'<div class="bar-bell-content">',
		'<div class="head">',
		'<h2>系统消息</h2>',
		'</div>',
		'<div class="content">',
		'<a class="img-box" href="#">',
		'<img src="' + STATIC_PATH + 'images/join.png"/>',
		'</a>',
		'<ul class="message-list">',
		'<li class="message-item">',
		'<a class="foxui-link" href="#">',
		'<span>功能更新 (2022年8月第2期)</span>',
		'<i class="foxui-icon-arrow-right"></i>',
		'</a>',
		'</li>',
		'<li class="message-item">',
		'<a class="foxui-link" href="#">',
		'<span>功能更新 (2022年8月第2期)</span>',
		'<i class="foxui-icon-arrow-right"></i>',
		'</a>',
		'</li>',
		'<li class="message-item">',
		'<a class="foxui-link" href="#">',
		'<span>功能更新 (2022年8月第2期)</span>',
		'<i class="foxui-icon-arrow-right"></i>',
		'</a>',
		'</li>',
		'</ul>',
		'</div>',
		'</div>',
	].join('');
}

// 标签调用 html
function _callHtml(dataObj) {
	return [
		'<div class="edit-model-call-dialog">',
		'<div class="foxui-input-group foxui-vertical">',
		'<label>首页调用：</label>',
		`<input class="foxui-size-small" readOnly placeholder="" value="${dataObj.index}" />`,
		'</div>',
		'<div class="foxui-input-group foxui-vertical margin-top-32">',
		'<label>列表页调用：</label>',
		`<input class="foxui-size-small" readOnly placeholder="" value="${dataObj.list}" />`,
		'</div>',
		'<div class="foxui-input-group foxui-vertical margin-top-32">',
		'<label>列表页调用：</label>',
		`<input class="foxui-size-small" readOnly placeholder="" value="${dataObj.article}" />`,
		'</div>',
		'<div class="section-top-info margin-top-32">',
		'<p>请将相应标签复制并粘贴到对应模板文件中！</p>',
		'</div>',
		'</div>',
	].join('');
}

// 校验颜色值是否合法
function _CheckIsColor(bgVal) {
	let type = '';
	if (/^rgb\(/.test(bgVal)) {
		//如果是rgb开头，200-249，250-255，0-199
		type =
			'^[rR][gG][Bb][(]([\\s]*(2[0-4][0-9]|25[0-5]|[01]?[0-9][0-9]?)[\\s]*,){2}[\\s]*(2[0-4]\\d|25[0-5]|[01]?\\d\\d?)[\\s]*[)]{1}$';
	} else if (/^rgba\(/.test(bgVal)) {
		//如果是rgba开头，判断0-255:200-249，250-255，0-199 判断0-1：0 1 1.0 0.0-0.9
		type =
			'^[rR][gG][Bb][Aa][(]([\\s]*(2[0-4][0-9]|25[0-5]|[01]?[0-9][0-9]?)[\\s]*,){3}[\\s]*(1|1.0|0|0.[0-9])[\\s]*[)]{1}$';
	} else if (/^#/.test(bgVal)) {
		//六位或者三位
		type = '^#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})$';
	} else if (/^hsl\(/.test(bgVal)) {
		//判断0-360 判断0-100%(0可以没有百分号)
		type =
			'^[hH][Ss][Ll][(]([\\s]*(2[0-9][0-9]|360|3[0-5][0-9]|[01]?[0-9][0-9]?)[\\s]*,)([\\s]*((100|[0-9][0-9]?)%|0)[\\s]*,)([\\s]*((100|[0-9][0-9]?)%|0)[\\s]*)[)]$';
	} else if (/^hsla\(/.test(bgVal)) {
		type =
			'^[hH][Ss][Ll][Aa][(]([\\s]*(2[0-9][0-9]|360|3[0-5][0-9]|[01]?[0-9][0-9]?)[\\s]*,)([\\s]*((100|[0-9][0-9]?)%|0)[\\s]*,){2}([\\s]*(1|1.0|0|0.[0-9])[\\s]*)[)]$';
	}
	if (!type || bgVal.match(new RegExp(type)) == null) {
		return false;
	} else {
		return true;
	}
}

// 按钮形状单选
$(document).on('click', '.button-radio .button-radio-item', function() {
	$(this).closest('.button-radio').find('.button-radio-item.is-active').removeClass('is-active');
	$(this).addClass('is-active');
});